@import 'styles/settings';
@import 'styles/common-animations.module';
@import 'styles/ui.module';

.sidebarContainer {
  @include animationFunction($propertyToAnimate: all);
  position: absolute;
  top: $ui-left-top;
  left: $site-gutter;
}

.modeSwitch {
  z-index: 3;
  position: absolute;
  left: 50%;
  bottom: 30px;
}

.challengesViewContainer {
  position: absolute;
  top: 0;
  left: 0;
  background-color: $challenges-view-background;
  width: 100vw;
  height: 100vh;
}


.challengesChart {
  position: relative;
  left: calc(#{$sidebar-width} + 120px);
  top: 50px;
}

.rankingChart {
  position: relative;
  left: calc(#{$sidebar-width} + 83px);
  top: 50px;
}

@media print {
  .hideOnPrint {
    display: none;
  }

  .sceneWrapper {
    display: none;
  }
}
